@extends('layouts.buz.layout', ['header_active' => 'settle'])

@section('title')
    资金流水列表
@endsection()

@section('full-content')

    @include('layouts.buz.sidebar.remit', ['active' => 'financeBills'])

    <div class="yhy-member col-sm-9 col-sm-push-3 col-md-10 col-md-push-2 col-xs-12">
        @include('buz.remit.financetitle')
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    资金流水
                </h4>
            </div>
            <div class="panel-body">
                <div class="row">
                    <div class="col-sm-3 col-md-3 lineH28">
                        <div class="form-group">
                            <label for="" class="col-sm-3">流水类型</label>
                            <div class="col-sm-9 col-md-9">
                                <select class="form-control" name="billType" id="billType">
                                    <option value="99">全部</option>
                                    <option value="1">支出</option>
                                    <option value="2">收入</option>
                                </select>
                            </div>

                        </div>
                    </div>
                    <div class="col-sm-3 col-md-3 lineH28">
                        <div class="form-group">
                            <label for="lastname" class="col-sm-2 control-label padd">起止时间</label>
                            <div class="col-sm-10 padd">
                                <input size="16" type="text"  id="starttime" class="form_datetime form-control"  style="width: 49%;">
                                <input size="16" type="text" id="endtime" class="form_datetime form-control"  style="width: 49%;">
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-3 col-md-3 lineH28">
                        <div class="form-group">
                            <label for="" class="col-sm-3">系统单号</label>
                            <div class="col-sm-9 col-md-9">
                                <input class="form-control" type="text" name="orderNo" id="orderNo">
                            </div>

                        </div>
                    </div>

                    <div class="col-sm-3 lineH28">
                        <div class="form-group">
                            <div class="col-sm-3 padd">
                                <button type="button" class="btn btn-primary" id="search">查询</button>
                            </div>
                            {{--<div class="col-sm-3 padd">--}}
                                {{--<button type="button" class="btn btn-primary" id="daochu">导出</button>--}}
                            {{--</div>--}}
                        </div>
                    </div>
                </div>
                <div class="historyList" id="billList">
                    <table class="table table-striped table-bordered" id="table">
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection()

@section('bottom_js')

    <script>

        $(function () {
            $('#table').bootstrapTable({
                url: '/api/finance/bills',
                queryParamsType: '',              //默认值为 'limit' ,在默认情况下 传给服务端的参数为：offset,limit,sort
                queryParams: queryParams,
                method: "get",
                pagination: true,
                pageNumber: 1,
                pageSize: 20,
                pageList: [10, 20, 50, 100],
                sidePagination: "server",         //分页方式：client客户端分页，server服务端分页（*）
                striped: true,                    //是否显示行间隔色
                cache: false,
                uniqueId: "id",               //每一行的唯一标识，一般为主键列
                height:700,
                paginationPreText: "上一页",
                paginationNextText: "下一页",
                onLoadSuccess: function(data){  //加载成功时执行
                    //这个地方可以放每页的统计信息
                    console.log(data);

                },
                responseHandler: function(res) {
                    if(filterAjaxData(res)){
                        return {
                            "total": res.data.total,//总页数
                            "rows": res.data.data   //数据
                        };
                    }else {
                        $("#loginModel").modal("toggle");
                    }

                },
                rowStyle: function (row, index) {
                    if (row.bill_type == 1) {
                        return {classes: "warning"};
                    } else {
                        return {};
                    }
                },
                // clickToSelect:true,
                // showExport: true,                     //是否显示导出
                // exportDataType: "basic",              //basic', 'all', 'selected'.
                columns: [
                   // { checkbox: true },
//                     { title: 'ID', field: 'id',visible: false, width: 50, align: "center", formatter: function (value, row, index) { return index + 1; } },
                    { title: '流水号', field: 'bill_id' },
                    { title: '系统单号', field: 'channel_id' },
                    { title: '流水类型', field: 'bill_type', formatter: function (value, row, index) {
                            if (value == 1) return '支出'; return '收入';
                        }},
                    { title: '流水来源', field: 'bill_channel',formatter: function (value, row, index) {
                            if(value==1){return "充值"}else{if (value==2) return "提现"; return "代付"}
                        }
                    },
                    { title: '流水金额', field: 'bill_amt'},
                    { title: '账户余额', field: 'cur_available' },
                    { title: '记录时间', field: 'created_at' },
                    { title: '流水信息', field: 'bill_info'},
                ],


            });
        })
        //查询条件
        function queryParams(params) {
            return {
                pageSize: params.pageSize,
                page: params.pageNumber,
                start_at: $("#starttime").val(),
                end_at: $("#endtime").val(),
                billType: $("#billType").val(),
                orderNo:$("#orderNo").val(),
            };
        }

        $("#billList").on("click",".pagination li a",function () {
            var _url = $(this).attr("data-url");
            if(_url){
                $.ajax({
                    url: _url,
                    type: 'get',
                    success:function(data){
                        if(filterAjaxData(data)){
                            console.log(data);

                            var html = template('list', data.data);
                            document.getElementById('billList').innerHTML = html;
                        }
                    }
                });
            }else{
                showMsg("没有啦")
            }
        })
        //时间
        $(".form_datetime").datetimepicker({
            language: 'zh-CN',
            format: "yyyy-mm-dd hh:ii",
            autoclose: true,
            todayBtn: true,
            minView: 1,
            inline: true
        });

        // $.ajax({
        //     url: "/api/finance/bills",
        //     type: 'get',
        //     success:function(data){
        //         if(filterAjaxData(data)){
        //             var html = template('list', data.data);
        //             document.getElementById('billList').innerHTML = html;
        //         }
        //     }
        // });

        //查询
        $("#search").click(function(){
            $('#table').bootstrapTable('refreshOptions', { pageNumber: 1 });
        });
    </script>
@endsection()
